<template>
  <div>
    <i-page-header class="product_tabs" title="基本设置"></i-page-header>
    <Card :bordered="false" dis-hover class="ivu-mt">
      <el-tabs>
        <el-tab-pane label="基本配置" style="background: #fff">
          <el-form ref="form" :model="form" label-width="100px">
            <el-divider content-position="left">基本数据</el-divider>
            <Row :gutter="24">
              <Col span="12">
                <el-form-item label="平台名称">
                  <el-input v-model="form.title"></el-input>
                </el-form-item>
              </Col>

              <Col span="12">
                <el-form-item label="网址信息">
                  <el-input v-model="form.url"></el-input>
                </el-form-item>
              </Col>
            </Row>

            <Row :gutter="24">
              <Col span="12">
                <el-form-item label="联系人">
                  <el-input v-model="form.lx_name"></el-input>
                </el-form-item>
              </Col>

              <Col span="12">
                <el-form-item label="联系电话">
                  <el-input v-model="form.lx_tel"></el-input>
                </el-form-item>
              </Col>
            </Row>

            <el-divider content-position="left">其他信息</el-divider>

            <Row :gutter="24">
              <Col span="12">
                <el-form-item label="客服电话">
                  <el-input v-model="form.custom_tel"></el-input>
                  <div>平台显示客服电话信息</div>
                </el-form-item>
              </Col>

              <Col span="12">
                <el-form-item label="客服QQ">
                  <el-input v-model="form.custom_qq"></el-input>
                  <div>平台显示的客服QQ信息。</div>
                </el-form-item>
              </Col>
            </Row>

            <el-form-item label="客服微信">
              <ui-upload
                :upUrl="upUrl"
                :img="form.weixin_logo"
                fileName="上传头像"
                :headers="upHeaders"
                @onUpload="handleUploadrSuccess"
                @onDelete="handleUploadrDel"
              ></ui-upload>
            </el-form-item>

            <el-form-item label="平台说明">
              <el-input
                type="textarea"
                placeholder="请输入平台说明信息"
                :autosize="{ minRows: 6, maxRows: 30 }"
                v-model="form.tag"
              ></el-input>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="onSubmit">立即修改</el-button>
              <el-button>取消</el-button>
            </el-form-item>
          </el-form>
        </el-tab-pane>
      </el-tabs>
    </Card>
  </div>
</template>
<script>
import UiUpload from '../../../../ui/upload/index'
import Setting from '../../../../setting'
import { SystemSave, SystemSys } from '../../../../api/system/sys'
import util from '../../../../libs/util'
import IPageHeader from '../../../../layouts/system/page-header/index'
export default {
  name: 'index',
  components: { IPageHeader, UiUpload },
  computed: {},
  data() {
    return {
      upHeaders: {},
      upUrl: '',
      form: {
        title: '',
        url: '',
        lx_name: '',
        lx_tel: '',
        custom_tel: '',
        custom_qq: '',
        weixin_logo: '',
        tag: '',
        record_code: '',
      },
    }
  },

  created() {
    var upHeaders = {}
    //上传路径
    this.upUrl = Setting.apiBaseURL + '/systemv1/upload/index'
    //上传header数据
    const token = util.cookies.get('system_token')
    if (token) {
      upHeaders['SYSTEM-ACC-TOKEN'] = token
    }
    this.upHeaders = upHeaders
  },

  mounted() {
    // this.$utils.loading(this, 'loading..')
    // SystemSys()
    //   .then((res) => {
    //     this.$utils.loadingClose()
    //     if (res.code == 200) {
    //       this.form = res.data
    //     } else {
    //       this.$alert(res.msg)
    //     }
    //   })
    //   .catch((err) => {
    //     this.$utils.loadingClose()
    //     this.$alert('网络繁忙，加载失败，请稍等片刻在尝试!', '系统提示')
    //   })
  },

  methods: {
    /**
     * 上传数据
     */
    handleUploadrSuccess: function (res) {
      if (res.code == -1) {
        Notice.error({
          title: '系统提示',
          content: res.msg,
        })
      } else {
        this.form.weixin_logo = res.data.img
      }
    },

    handleUploadrDel: function (res) {
      console.log('xxx')
      this.form.weixin_logo = ''
    },

    /**
     * 提交数据
     */
    onSubmit: function () {
      this.$utils.loading(this, '加载中...')
      SystemSave(this.form)
        .then((res) => {
          this.$utils.loadingClose()
          if (res.code == 200) {
            this.$message({
              message: '恭喜你，修改成功',
              type: 'success',
            })
          } else {
            this.$alert(res.msg)
          }
        })
        .catch((err) => {
          this.$utils.loadingClose()
          this.$alert('网络繁忙，加载失败，请稍等片刻在尝试!', '系统提示')
        })
    },
  },
}
</script>
<style scoped></style>
